/**
* Copyright (c) 2014 秦昊杰  
* 
*
* Version: 1.0.0
*
* date 2014年9月27日11:49:58
*/




//	warp : '.group-warp',		//包裹层一般无需添加
//	content : 'li' ,			//子内容选择器
//	len  : 4,         			//每一版面包涵的子内容数目
//	btn_prev : '.prev',			//点击触发下一版面按钮的选择器
//	btn_next : '.next',
//	derection : 'left',			
//	speed : '400',
//	focus : 'span'   ,    //版面的标记 类似小圆点
//	cls_focus : 'active',   //当前版面小圆点的class
//	marginDerection : false  //每个子内容margin方向(版面的最后一个子内容无margin其他子内容有才填写)
//  auto : false,
//	autoSpeed : '5000',
//  perNum : 0                       //每次移动的子内容个数  默认与len相同



$.fn.groupSwitch = function(option){
	var opts = $.extend({}, $.fn.groupSwitch.defaults, option);
	return this.each(function(index, el) {
		var $this = $(this),
		    $content = $(opts.content,$this),
		    current = 1,   // 当前版面索引
		    ready = $this.data('isready'),  //是否初始化
		    conLen  = $content.length,      // 子内容总长度
		    conWidth = opts.derection == "left"? $content.outerWidth(true) :$content.outerHeight(true),
		    mr =  opts.marginDerection ? parseInt($content.css('margin'+opts.marginDerection)) :0,
		    perWidth = conWidth * opts.len - mr,   //每个版面的宽度
		    totalNum = Math.ceil( conLen / opts.len), //版面个数
		    totalWidth = perWidth * totalNum , //总宽度
			timer = null,
			foucsIndex = 0,
			num = opts.perNum ? opts.len / opts.perNum : 1;


	    if( ready != 'true'){
	    	$this.data('isready','true');
	    	if ($(opts.warp, $this).length < 1) {
                //$content.wrapAll("<div class=\"group-warp clearfix\" style=\"" + (opts.derection == 'left' ? 'width' : 'height') + ":" + perWidth + "px;overflow:hidden;position:relative;\"><div class=\"gourp-inner clearfix\" style=\""+(opts.derection == 'left' ? 'width' : 'height')+ ":"+ totalWidth + "px;position:relative;\"></div></div>");
                $content.wrapAll("<div class=\"group-warp clearfix\" ><div class=\"group-inner clearfix\"></div></div>");            	
            } ;
            if (opts.derection == 'left') {
                $content.css({ "float": "left", "display": "block" });
            };
           
            var frontContent = $content.slice(0,opts.len).clone(true),
            	rearContent = $content.slice(-opts.len).clone(true);

            $this.find('.group-inner').append(frontContent).prepend(rearContent);
            var newTotalNum = totalNum + 2;
            var newTotalWidth = newTotalNum * perWidth;
            if(opts.derection == 'left'){
            	$this.find('.group-warp').css({
            		position: 'relative',
            		overflow: 'hidden',
            		width : perWidth
            	});

            	$this.find('.group-inner').css({
            		position: 'relative', 
            		width : newTotalWidth,
            		left : -perWidth          	
            	});
            }else{
            	$this.find('.group-warp').css({
            		position: 'relative',
            		overflow: 'hidden',
            		height : perWidth
            	});

            	$this.find('.group-inner').css({
            		position: 'relative', 
            		height : newTotalWidth,
            		top : -perWidth          	
            	});
            }

	    }

	    if (opts.perNum > 0) { //如果每次移动的子内容个数不是每个版面子内容个数
	 			perWidth = conWidth * opts.perNum;
	 			newTotalNum = newTotalNum * opts.len ;
	 			current =  num; 
	 		};
		
	    $this.find(opts.btn_next).click(function(){
	    	if( ! $this.find('.group-inner').is(":animated") ){
	    		change(++current);
	    	}	    
	    	return false;
	    });
	    

	    $this.find(opts.btn_prev).click(function(){
	    	
	    	if( ! $this.find('.group-inner').is(":animated") ){
	    		change(--current);
	    	};
	    		    
	    	return false;
	    });

	    $this.find(opts.focus).click(function(event) {
	    	current = $this.find(opts.focus).index(this) + 1;
	    	change(current);
	    	return false;
	    });

	    if(opts.auto) {//如果自动滚动
	        timer = setInterval(function() {
	            change(++current);
	        }, opts.autoSpeed);

	        $this.hover(function() {
	            clearInterval(timer);
	        }, function() {
	            timer = setInterval(function() {
	                change(++current);
	            }, opts.autoSpeed);
	        });
	    };

	    function change(nextIndext){
	    	current = (nextIndext+newTotalNum) % newTotalNum;
	    	var derection = opts.derection== 'left' ? 'left' : 'top';
	    	if (derection == 'left'){
				$('.group-inner',$this).stop().animate({
               		left : -perWidth * current
           		}, opts.speed,checkPosition);
	    	}else {
	    		$('.group-inner',$this).stop().animate({
               		top : -perWidth * current
           		}, opts.speed,checkPosition);
	    	};
          	checkFocusIndex();
	    	$this.find(opts.focus).eq(foucsIndex).addClass(opts.cls_focus)
	    		  .siblings(opts.foucs).removeClass(opts.cls_focus);
	    	$this.trigger('groupSwitch',foucsIndex);	  	    	
	    }

	    function checkPosition(){
	    	if( (current+num)==newTotalNum  &&  opts.derection == 'top'){
	    		$this.find('.group-inner').css({           		
            		top : -perWidth  * num        	
            	});
            	current = num ;
	    	};
	    	if( (current+num)==newTotalNum  &&  opts.derection == 'left'){
	    		$this.find('.group-inner').css({           		
            		left : -perWidth  * num       	
            	});
            	current = num ;
	    	};
	    	if( current==0 &&  opts.derection == 'top'){
	    		$this.find('.group-inner').css({           		
            		top : -perWidth * totalNum  * num       	
            	});
            	current = newTotalNum - 2 * num;
	    	};
	    	if( current==0  &&  opts.derection == 'left'){
	    		$this.find('.group-inner').css({           		
            		left : -perWidth   * totalNum  * num     	
            	});
            	current = newTotalNum - 2 * num ;
	    	}; 
	    };

	    function checkFocusIndex(){
	    	if( current == 0 ){
	    		foucsIndex = totalNum - 1; 
	    	}else if( current == newTotalNum -1){
	    		foucsIndex = 0;
	    	}else{
	    		foucsIndex = current - 1;
	    	}
	    };	

	    
	});
	
};
$.fn.groupSwitch.defaults = {
	warp : '.group-warp',//包裹层
	content : 'li' ,
	len  : 4,         //每一版面包涵的子内容
	btn_prev : '.prev',
	btn_next : '.next',
	derection : 'left',
	speed : 400,
	focus : 'group-span'   ,    //版面的标记 类似小圆点
	cls_focus : 'active',   //当前版面小圆点的class
	marginDerection : false,  //每个子内容margin方向(版面的最后一个子内容无margin其他子内容有才填写)
	auto : false,
	autoSpeed : '5000',
	perNum : 0                       //每次移动的子内容个数  默认与len相同
};